<html>
<head><title>Balance-Checker(OPTIONS)</title></head>
<link type="text/css" rel="stylesheet" href="../css/button.css">
<script src="../js/balance.js" type="text/javascript"></script>
<script src="../js/jquery-1.7.2.js" type="text/javascript"></script>
<script src="../js/balance_listener.js" type="text/javascript"></script>
<style>
	.panel{display:none;}
</style>
<script>	
	function changeVisibility(){
		if ($(".panel:first").is(":hidden"))
		{
			$(".btn_show").toggleClass("btn_hide");
			$(".panel").slideDown("slow");
			
		}
		else
		{
			$(".panel").slideUp("slow", function(){
				$(".btn_show").toggleClass("btn_hide");
			});
		}
	}	
</script>

<body onload="restore_options()">
	<div class="text_info">Specify Your login Information</div>
	<table id="login_info">
		<tr>
			<td align="center">
				<div class="text_info">Login</div>
			</td>
		</tr>
		<tr>
			<td align="center">
				<input type="text" name="login" id="login" value="" size="15" tabindex="1" maxlength="255" />
			</td>
		</tr>
		<tr>
			<td align="center">
				<div class="text_info">Password</div>
			</td>
		</tr>
		<tr>
			<td align="center">
				<input type="password" name="password" id="password" value="" size="15" tabindex="2" maxlength="255" />
			</td>
		</tr>
	</table>
	<table id="listeners_info" cellpadding="0px" cellspacing="0px">
		<tr>
			<td>
				<div class="btn_show" onClick="changeVisibility()"/>
			</td>
		</tr>
		<tr>
			<td>
				<div class="panel">
					<table id="listeners_header" width="100%" cellpadding="0px" cellspacing="0px">
						<col width="80"/>
						<col width="150"/>
						<col width="50"/>
						<col width="50"/>
						<tr>
							<th class="first_cell"><div class="text_column">Listener ID</div></th>
							<th class="between_cell"><div class="text_column">Listener Critical Value</div></th>
							<th class="between_cell"><div class="text_column">Active</div></th>
							<th class="last_cell"><div class="text_column">Action</div></th>
						</tr>
					</table>
					<table id="listeners" width="100%" cellpadding="0px" cellspacing="0px">
						<col width="80"/>
						<col width="150"/>
						<col width="50"/>
						<col width="50"/>
					</table>
					<table id="listeners_modificator" width="100%" cellpadding="0px" cellspacing="0px">
						<col width="80"/>
						<col width="150"/>
						<col width="50"/>
						<col width="50"/>
						<tr>
							<td style="background:url(../img/view_last_row.png) no-repeat 0 0; height: 50px;" align="center"></td>
							<td style="background:url(../img/view_last_row.png) no-repeat 33% 0; height: 50px;" align="center"><input type="text" id="new_listener_cv"/></td>
							<td style="background:url(../img/view_last_row.png) no-repeat 66% 0; height: 50px;"  align="center"></td>
							<td style="background:url(../img/view_last_row.png) no-repeat 100% 0; height: 50px;" align="center"><div class="btn_add" onClick="add_listener()"/></td>
						</tr>
					</table>
				</div>
			</td>
		</tr>
	</table>
	<table id="operations" cellpadding="0px" cellspacing="0px">
		<tr>
			<td><div class="btn_save" onClick="save_options()"/></td>
			<td><div class="btn_option_close" onClick="close_current_tab()"/></td>
		</tr>
	</table>
</body>
</html>